<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>Document</title>
		<link rel="stylesheet" href="../../css/flf_css/all.css">
		<link rel="stylesheet" href="../../css/flf_css/Department_list.css">
		<!-- 引入 layui.css -->
		<link rel="stylesheet" href="../../libs/layui/css/layui.css">

		<!-- 引入 layui.js -->

	</head>
	<body>
		<header class="header">
			<div class="container clear">
				<div class="header-left">部门列表</div>
				<div class="header-right" id="header-right"><a href="Department_list.html">返回</a></div>
			</div>
		</header>
			<div class="form clear">
				<form class="layui-form" action="">
					<div class="form-left" style="width: 45%;">
						<div class="layui-form-item">
					 	<label class="layui-form-label">部门名称</label>
							<div class="layui-input-block">
								<input id='id' type="text" name="id" lay-verify="title" autocomplete="off"
									placeholder="部门名称" class="layui-input">
							</div>
						</div>

						<div class="layui-form-item">
							<label class="layui-form-label">部门联系人</label>
							<div class="layui-input-block">
								<input id='username' type="text" name="username" lay-verify="title1" autocomplete="off"
									placeholder="部门联系人" class="layui-input">
							</div>
						</div>
					</div>

					<div class="form-right" style="width: 45%;">
						<div class="layui-form-item">
					  <label class="layui-form-label">部门人数</label>
							<div class="layui-input-block">
								<input id='numbar' type="text" name="numbar" lay-verify="title" autocomplete="off"
									placeholder="部门人数" class="layui-input">
							</div>
					 </div>
						<div class="layui-form-item">
							<label class="layui-form-label">创建时间</label>
					 	<div class="layui-input-block">
								<input id='usertime' type="text" name="usertime" lay-verify="title" autocomplete="off"
									placeholder="创建时间" class="layui-input">
							</div>
						</div>
						<div class="layui-form-item">
							<label class="layui-form-label">联系人电话</label>
							<div class="layui-input-block">
								<input  id='tnumbar' type="text" name="tnumbar" lay-verify="title" autocomplete="off"
									placeholder="联系人电话" class="layui-input">
							</div>
						</div>
						
					</div>
					 <div class="layui-form-item">
					  <div class="layui-input-block">
				
					    <button type="submit" class="layui-btn" lay-submit="" lay-filter="demo1">立即提交</button>
					  </div>
					</div>
				</form>
			</div>
			<script src="../../libs/layui/layui.js"></script>
			<script src="../../libs/layui/layer.js"></script>
			
			<script>
			layui.use(['form', 'layedit', 'laydate'], function(){
			  var form = layui.form
			  ,layer = layui.layer
			  ,layedit = layui.layedit
			  ,laydate = layui.laydate;
			  
			  //日期
			  laydate.render({
			    elem: '#date'
			  });
			  laydate.render({
			    elem: '#date1'
			  });
			  
			  //创建一个编辑器
			  var editIndex = layedit.build('LAY_demo_editor');
			 
			  //自定义验证规则
			  form.verify({
			    title: function(value){
			      if(value.length < 3){
			        return '标题至少得3个字符啊';
			      }
			    }
			    ,pass: [
			      /^[\S]{6,12}$/
			      ,'密码必须6到12位，且不能出现空格'
			    ]
			    ,content: function(value){
			      layedit.sync(editIndex);
			    }
			  });
			  
			  //监听指定开关
			  form.on('switch(switchTest)', function(data){
			    layer.msg('开关checked：'+ (this.checked ? 'true' : 'false'), {
			      offset: '6px'
			    });
			    layer.tips('温馨提示：请注意开关状态的文字可以随意定义，而不仅仅是ON|OFF', data.othis)
			  });
			
			
			  
			  //监听提交
			  form.on('submit(demo1)', function(data){
				  let csdata = sessionStorage.getItem('key')?[...JSON.parse(sessionStorage.getItem('key'))]:[]
				  var a  = data.field
				  a.date = +new Date()
				  
				  csdata.push(a)
				
				  sessionStorage.setItem('key',JSON.stringify(csdata))
				  layer.msg('添加成功');
				  setTimeout(()=>{
					  window.location.href='Department_list.html';
				  },1000)
				 /// 
			    return false;
			  });
			 
			  //表单赋值
			  layui.$('#LAY-component-form-setval').on('click', function(){
			    form.val('example', {
			      "username": "贤心" // "name": "value"
			      ,"password": "123456"
			      ,"interest": 1
			      ,"like[write]": true //复选框选中状态
			      ,"close": true //开关状态
			      ,"sex": "女"
			      ,"desc": "我爱 layui"
			    });
			  });
			  
			  //表单取值
			  layui.$('#LAY-component-form-getval').on('click', function(){
			    var data = form.val('example');
				console.log(data)
			    //alert(JSON.stringify(data));
				

			  });
			  
			});
			</script>
	</body>
</html>
